<template>
	<view class="content">

		<view class="main">
			<view class="list">
				<view class="listBox" @tap="nextPage(`/pages/changePassword/changePassword`)">
					<view class="listLeft">
						<image src="/static/mySet/user.png" mode=""></image>
						<text>账号与安全</text>
					</view>
					<u-icon name="arrow-right	" color="#969799" size="36"></u-icon>
				</view>
				<view class="listBox" @tap="nextPage(`/pages/myHelp/myHelp?type=big`)">
					<view class="listLeft">
						<image src="/static/mySet/txt.png" mode=""></image>
						<text>帮助与反馈</text>
					</view>
					<u-icon name="arrow-right	" color="#969799" size="36"></u-icon>
				</view>

        <view class="btn buttom">
          <button type="default"
                  @click="onLogout"
          >退出登录 </button>
        </view>
			</view>

		</view>
		<Tabbar :current="3"></Tabbar>
	</view>
</template>
<script>
import cacheStore from '@/common/cache'
import NavTitle from "../../components/NavTitle/NavTitle.vue"
import {logoutUserInfo} from '@/api/login'
export default {
	components: {
		NavTitle,
	},
	data() {
		return {

		}
	},
	onLoad() {

	},
	methods: {
		//跳转列表对应页面
		nextPage(url) {
			uni.navigateTo({
				url: url,
				fail() {
					uni.switchTab({
						url: url,
						fail() {
							uni.showToast({
								title: '暂未开通，敬请期待！',
								icon: 'none'
							});
						}
					});
				}
			});
		},
    onLogout(){
      uni.showModal({
        title: '提示',
        content: '是否要退出登录?',
        success: res=> {
          if (res.confirm) {
            logoutUserInfo().then(res=>{
              this.$store.dispatch('setUserInfo',{user:''})
              this.$store.dispatch('setUserToken',{token:''})
              cacheStore.removeStorageSync('userInfo')
              cacheStore.removeStorageSync('token')
              this.$u.route({
                animationDuration:500,
                url: '/pages/index/index',
                type:'reLaunch'
              })
            }).catch(res=>{
              this.$showToast(res.message)
            })

          }
        }
      });
    }
	}
}
</script>

<style lang="scss" scoped>
.content{
	.main{
		padding-top: 30rpx;
		height: 100vh;
		background: #F0F3F5;
		.list{
			padding: 20rpx 30rpx 0 30rpx;
			background: #FFFFFF;
			.listBox{
				margin-bottom: 20rpx;
				padding-bottom: 20rpx;
				display: flex;
				justify-content: space-between;
				border-bottom: #E3E3E3 2rpx solid;
				.listLeft{
					display: flex;
					align-items: center;
					image{
						width: 40rpx;
						height: 44rpx;
					}
					text{
						margin-left: 20rpx;
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #323233;
					}
				}
			}
		}
	}
}
.buttom{
  position: absolute;
  top:50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 89%;
}
</style>

